<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>search</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<!--标准mui.css-->
		<link rel="stylesheet" href="../css/mui.min.css">
		<!--App自定义的css-->
		<link rel="stylesheet" type="text/css" href="../css/app.css" />
		<link rel="stylesheet" type="text/css" href="../css/icons-extra.css">
		<!--自定义iconfont-->
		<link rel="stylesheet" type="text/css" href="../css/iconfont.css">
		<link rel="stylesheet" type="text/css" href="../css/shopping-cart.css">
		<script type="text/javascript">
			//定义全局变量
			var i = 0;
			//金额总和
			var money = 0;
			//计算合计价格
			var cart_money = new Object();
			//全部商品ID
			var cart_id = new Object();
			//备份商品ID，用于全选后去掉全选又再次全选
			var cart_id_copy = new Object();
		</script>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">购物车</h1>
			<a class="rig_shai" id="rem_s" href="javascript:void(0)" style="margin-right: 2%;position: absolute; top: 5px; right: 3%;">编辑</a>
		</header>
		<div style="height:44px;"></div>

		<form method="post" name="cart_form" target="_self" id="cart_form" action="">
			<!--list-->
			<div class="commodity_list_box">
				
				<!--商品列表-->
				<div class="commodity_box">
					<div class="commodity_list">
						<!--店名信息-->
						
						<!--商品-->
						<ul class="commodity_list_term" style="padding-bottom: 37px; margin: 0">

						</ul>
						
					</div>
				</div>
				
				<!-- 商品列表 end -->
			</div>
			<!-- end -->

			<!-- footer -->
			<div style="height:55px;"></div>
			<div class="settle_box">
				<ul class="all_check select">
					<li><span id="all_pitch_on"></span><div>全选</div></li>
				</ul>
				<ul class="total_amount">
					<li style="display: flex;">合计：<p id="total_price">¥<b>0</b></p></li>
					<li style="display: flex;">
						<a class="settle_btn" id="confirm_cart" onclick="big_cart_remove()">结算</a>
					</li>
				</ul>
				<a class="settle_btn" href="javascript:void(0);" id="confirm_cart1" onclick="big_cart_remove()">删除</a>
			</div>
			<!-- end -->
		</form>
		<div class="nav-footer">
			<a class="" href="index.html">
				<span class="mui-icon mui-icon-home"></span>
				<span class="mui-tab-label">首页</span>
			</a>
			<a href="new-classification.html">
				<span class="mui-icon mui-icon-list"></span>
				<span class="mui-tab-label">分类</span>
			</a>
			<a class="icon-active" href="#">
				<span class="mui-icon mui-icon-extra mui-icon-extra-cart"></span>
				<span class="mui-tab-label">购物车</span>
			</a>
			<a href="new-mine.html">
				<span class="mui-icon mui-icon-contact"></span>
				<span class="mui-tab-label">个人中心</span>
			</a>
		</div>
		<script src="../js/mui.min.js"></script>
		<script src="../js/jquery.min.js"></script>
		<script src="../js/appData.js"></script>
		<script>
			$(function() {
				// console.log(AppData.getUser('huzhangjie').cart)	
				// 查找当前登录用户的购物车
				let account = JSON.parse(localStorage.getItem('$loginUser')).account				
				let data = JSON.parse(localStorage.getItem('$appData'))
				
				let myCartGoods = AppData.getUser(data.data, account).cart
				myCartGoods.forEach(item => {
					$('.commodity_list_term').append(`
						<li class="select">
							<em aem="0" data-id="${item.id}" class=""></em>
							<img src="${item.images[0]}" />
							<div class="div_center">
								<h4>${item.title}</h4>
								<span>颜色:<label class="mr-6">默认</label>尺寸:<label >默认</label></span>
								<p class="now_value"><i>￥</i><b class="qu_su">${item.price}</b></p>
							</div>
							<div class="div_right">
								<i onclick="reducew(this)">-</i>
								<span class="zi">${item.num}</span>
								<input type="hidden" value="84">
								<i onclick="plusw(this)">+</i>
							</div>
						</li>
					`)
				});
			})

		</script>

		<script>
			var noX = 0; /* 没选中时点击加减计算数量  */
			// var allThis = $(".commodity_box .select em"); /*底部全选*/			
			/* 减  */
			function reduceMod(e, totalH, mod, noX) {
				var tn = e.siblings().find(".qu_su").text(); /* 当前选中商品  */
				var tn1 = e.siblings().find(".zi").text(); /* 商品数量  */
				if(mod != 2) {
					var Total = parseFloat(totalH) - (tn * tn1); /* 总价格减该商品总数价格  */
					$("#total_price b").text(Total.toFixed(2));
				} else {
					/* 合计加单价-1 */
					var Total = parseFloat(totalH) - parseFloat(tn); /* 总价格减该商品总数价格  */
					$("#total_price b").text(Total.toFixed(2));
				}

			};
			/* 加  */
			function plusMod(e, totalH, mod) {
				var tn = e.siblings().find(".qu_su").text(); /* 当前选中商品  */
				var tn1 = e.siblings().find(".zi").text(); /* 商品数量  */
				if(mod != 2) {
					var Total = parseFloat(totalH) + (tn * tn1); /* 总价格加上该商品总数价格  */
					$("#total_price b").text(Total.toFixed(2));
				} else {
					/* 合计加单价+1 */
					var Total = parseFloat(totalH) + (parseFloat(tn) + (noX - 1)); /* 总价格加上该商品总数价格  */
					$("#total_price b").text(Total.toFixed(2));
				}

			};
			/*全选该店商品价格 加*/
			function commodityPlusMod(e, totalH) {
				var qu = e.parents(".commodity_list").find(".pitch_on").parent().find(".qu_su");
				var quj = e.parents(".commodity_list").find(".pitch_on").parent().find(".zi");
				var Total = 0;
				var erTotal = true;
				/* 该商品全部金额  */
				for(var i = 0; i < qu.length; i++) {
					var n = qu.eq(i).text();
					var n1 = quj.eq(i).text();
					/*合计价格*/
					if(erTotal) {
						Total = parseFloat(totalH) + (parseFloat(n) * parseFloat(n1));
						if(Total < 0)
							Total = 0;
						erTotal = false;
					} else {
						Total = parseFloat(Total) + (parseFloat(n) * parseFloat(n1));
						if(Total < 0)
							Total = 0;
					}
				}
				$("#total_price b").text(Total.toFixed(2)); /* 合计金额  */
			};
			var plus;
			/*全选该店商品价格 减*/
			function commodityReduceMod(e, totalH) {
				var qu = e.parents(".commodity_list").find(".pitch_on").parent().find(".qu_su");
				var quj = e.parents(".commodity_list").find(".pitch_on").parent().find(".zi");
				var Total = 0;

				var erTotal = true;
				/* 该商品全部金额  */
				for(var i = 0; i < qu.length; i++) {
					var n = qu.eq(i).text();
					var n1 = quj.eq(i).text();
					/*合计价格*/
					if(erTotal) {
						Total = parseFloat(totalH) - (parseFloat(n) * parseFloat(n1));
						plus = parseFloat(n) * parseFloat(n1);
						if(Total < 0)
							Total = 0;
						erTotal = false;
					} else {
						Total = parseFloat(Total) - (parseFloat(n) * parseFloat(n1));
						plus = parseFloat(n) * parseFloat(n1);
						if(Total < 0)
							Total = 0;
					}

					$("#total_price b").text(Total.toFixed(2)); /* 合计金额  */
				}

				return plus;
			};
			/*全部商品价格*/
			function commodityWhole() {
				/* 合计金额  */
				var je = $(".commodity_box .select .qu_su"); /* 全部商品单价  */
				var je1 = $(".commodity_box .select .zi"); /* 全部商品数量  */
				var TotalJe = 0;
				for(var i = 0; i < je.length; i++) {
					var n = je.eq(i).text();
					var n1 = je1.eq(i).text();
					TotalJe = TotalJe + (parseFloat(n) * parseFloat(n1));

				}
				$("#total_price b").text(TotalJe.toFixed(2)); /* 合计金额  */
			};

			//选择结算商品
			
			$(function() {
				$(".select em").click(function() {
				var su = $(this).attr("aem");
				var carts_id = $(this).attr("cart_id");
				var totalH = $("#total_price b").text(); /* 合计金额  */
				if(su == 0) {
					/* 单选商品  */
					if($(this).hasClass("pitch_on")) {
						/*去该店全选*/
						$(this).parents("ul").siblings(".select").find("em").removeClass("pitch_on");
						/*去底部全选*/
						$("#all_pitch_on").removeClass("pitch_on");
						$(this).removeClass("pitch_on");
						reduceMod($(this), totalH);
						cart_id[carts_id] = "";
						delete cart_id[carts_id];
					} else {
						$(this).addClass("pitch_on");
						var n = $(this).parents("ul").children().find(".pitch_on");
						var n1 = $(this).parents("ul").children();
						plusMod($(this), totalH, 0, noX);
						cart_id[carts_id] = "";
						/*该店商品全选中时*/
						if(n.length == n1.length) {
							$(this).parents("ul").siblings(".select").find("em").addClass("pitch_on");
						}
						/*商品全部选中时*/
						var fot = $(".commodity_list_box  .pitch_on");
						var fot1 = $(".commodity_list_box em");
						if(fot.length == fot1.length)
							$("#all_pitch_on").addClass("pitch_on");
					}
				} else {
					/* 全选该店铺  */
					if($(this).hasClass("pitch_on")) {
						/*去底部全选*/
						$("#all_pitch_on").removeClass("pitch_on");
						$(this).removeClass("pitch_on");

						commodityReduceMod($(this), totalH);
						$(this).parent().siblings("ul").find("span").removeClass("pitch_on");
						delete cart_id[carts_id];
					} else {
						commodityReduceMod($(this), totalH);

						$(this).addClass("pitch_on");

						$(this).parent().siblings("ul").find("span").addClass("pitch_on");

						if(plus != NaN && plus != undefined) {
							totalH = parseFloat(totalH) - parseFloat(plus);
						}

						commodityPlusMod($(this), totalH);
						cart_id[carts_id] = "";
						/*商品全部选中时*/
						var fot = $(".commodity_list_box  .pitch_on");
						var fot1 = $(".commodity_list_box  span");
						if(fot.length == fot1.length)
							$("#all_pitch_on").addClass("pitch_on");

					}
				}

				//计算选择数值
				number();

			});
			
			})
			/* 底部全选  */

			var bot = 0;
			$("#all_pitch_on").click(function() {
				var allThis = $(".commodity_box .select em")
				console.log("点击全选");
				if(bot == 0) {
					console.log("全选bot=0");
					$(this).addClass("pitch_on");
					allThis.removeClass("pitch_on");
					allThis.addClass("pitch_on");
					/*总价格*/
					commodityWhole();
					bot = 1;
					//重新加入属性对象
					for(var key in cart_id_copy) {
						cart_id[key] = "";
					}
				} else {
					console.log("全选bot=1");
					$(this).removeClass("pitch_on");
					allThis.removeClass("pitch_on");
					$("#total_price b").text("0");
					bot = 0;
					//移除全部对象
					for(var key in cart_id) {
						delete cart_id[key];
					}
				}
				//计算选择数值
				number();
			});

			function number() {
				var num = 0;
				for(var key in cart_id) {
					num++;
				}
				//将选择的放入到计算里面
				//$("#confirm_cart").html("结算("+num+")");
			}

			/* 编辑商品  */
			var topb = 0;
			$("#rem_s").click(function() {
				if(topb == 0) {
					$(this).text("完成");
					$(".total_amount").hide(); /* 合计  */
					$("#confirm_cart").hide(); /* 结算  */
					$("#confirm_cart1").show(); /* 删除 */
					topb = 1;
				} else {
					topb = 0;
					$(this).text("编辑");
					$(".total_amount").show(); /* 合计  */
					$("#confirm_cart").show(); /* 结算  */
					$("#confirm_cart1").hide(); /* 删除 */
					allThis.removeClass("pitch_on"); /* 取消所有选择  */
					$("#all_pitch_on").removeClass("pitch_on"); /* 取消所有选择  */
					$("#total_price b").text("0"); /*合计价格清零*/

				}

			});
			/* 加减  */

			function reducew(obj) {
				//减
				var $this = $(obj);
				var totalH = $("#total_price b").text(); /* 合计金额  */
				var ise = $this.siblings("span").text();
				var gc_id = $this.siblings("input").val();
				if(noX <= 0) {
					noX = 0;
				} else {
					noX--;
				};

				if(parseInt(ise) <= 1) {
					$this.siblings("span").text("1");
				} else {
					var n = parseInt(ise) - 1;
					$this.siblings("span").text(n);
					if($this.parent().parent().children("em").hasClass("pitch_on")) {
						var mo = $this.parent().parent().children("em");
						reduceMod(mo, totalH, 2, noX);
						noX = 0;
					}

				}
			};

			function plusw(obj) {
				//加
				var $this = $(obj);
				var totalH = $("#total_price b").text(); /* 合计金额  */
				var ise = $this.siblings("span").text();
				var gc_id = $this.siblings("input").val();
				var n = parseInt(ise) + 1;
				noX++;

				$this.siblings("span").text(n);
				if($this.parent().parent().children("em").hasClass("pitch_on")) {
					var mo = $this.parent().parent().children("em");
					plusMod(mo, totalH, 2, noX);
					noX = 0;
				}
			}

			//删除 
			function big_cart_remove() {
				let idArr = []
				let data = JSON.parse(localStorage.getItem('$appData'))
				// console.log(data.data.userList)
				let account = JSON.parse(localStorage.getItem('$loginUser')).account
				// 拿到选中的商品的id数组
				Array.prototype.forEach.call($(".commodity_list_term .pitch_on"), item => {
					idArr.push(item.dataset.id)
				})
				AppData.removeGoods(data.data, account, idArr)
				localStorage.setItem('$appData', JSON.stringify(data))
				$("#all_pitch_on").removeClass("pitch_on")
				$("#total_price b").text('0')
				$(".commodity_list_term .pitch_on").parent().remove();
				// $(".commodity_list  > em.pitch_on").parents(".commodity_box").remove();
			}
		</script>

	</body>

</html>